import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:get/get.dart';
import 'package:sainbainu/common/extension/load_image.dart';
import 'package:sainbainu/common/values/colors.dart';

import '../index.dart';

class SearchInput extends GetView<GlobalSearchController> {
  final void Function() onClearTap;
  final void Function(String text) onDoneTap;

  const SearchInput({
    super.key,
    required this.onClearTap,
    required this.onDoneTap,
  });

  @override
  Widget build(BuildContext context) {
    return Container(
      height: 38,
      decoration: const BoxDecoration(
        borderRadius: BorderRadius.all(Radius.circular(20)),
        color: AppColors.border,
      ),
      clipBehavior: Clip.antiAlias,
      child: Row(
        children: [
          Padding(
            padding: const EdgeInsets.only(left: 10),
            child: Image.asset(
              'search.png'.img,
              width: 20,
              height: 20,
            ),
          ),
          Expanded(
            child: TextField(
              controller: controller.state.searchInputController,
              focusNode: controller.state.searchFocusNode,
              decoration: InputDecoration(
                border: const OutlineInputBorder(borderSide: BorderSide.none),
                contentPadding: const EdgeInsets.symmetric(
                  vertical: 7,
                  horizontal: 5,
                ),
                fillColor: AppColors.border,
                filled: true,
                isDense: true,
                hintText: '关键词搜索'.tr,
                hintStyle: const TextStyle(fontSize: 15),
                suffixIcon: Obx(
                  () => controller.state.searchText.value.isNotEmpty
                      ? GestureDetector(
                          onTap: onClearTap,
                          child: const Icon(
                            Icons.cancel_rounded,
                            color: AppColors.unactive4,
                            size: 20,
                          ),
                        )
                      : const SizedBox.shrink(),
                ),
              ),
              textInputAction: TextInputAction.search,
              cursorColor: AppColors.primary,
              cursorHeight: 16,
              textAlignVertical: TextAlignVertical.center,
              onSubmitted: (value) => onDoneTap(value),
            ),
          ),
        ],
      ),
    );
  }
}
